<template>
    <div class="box">
        <left @eventLeftMsg="getLeftChildMsg"></left>
        <right :msg="message"></right>
    </div>
</template>

<script>
import Left from './components/Left.vue'
import Right from './components/Right.vue'
export default {
  components: { Left, Right },
  data(){
    return{
        message:''
    }
  },
  methods:{
    getLeftChildMsg(val){
       this.message=val
    }
  }

}
</script>

<style>
    .box{
        display: flex;
    }
</style>